import React,{memo} from 'react'
import {makeStyles,TextField } from '@material-ui/core';
const useStyles = makeStyles((theme) => ({
    error: {
      padding:0,
      color: 'red',
      textAlign:'left',
      fontSize:'12px',
      margin:0,
      paddingLeft:'1.4rem'
    }
  }));


function Password({styleProps,value,touched,errors,setFieldValue}) {
    const classes = useStyles();
    return (
        <div>
            <TextField type="password" style={styleProps} id="password" label="Password *" variant="outlined" value={value} onChange={(e)=>{
                setFieldValue('password',e.target.value);
            }}  />
            {(touched && errors.password) && <p className={classes.error}>{errors.password}</p>}
        </div>
    )
}
export default memo(Password);
